<template>
  <a-modal :visible="show" width="70vw" title="工程技术列表" @ok="handleClose" @cancel="handleClose" :maskClosable="false"
    :key="show">

    <div class="header">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row type="flex" justify="space-between" align="middle">
          <a-col :xl="{ span: 14 }" :lg="{ span: 14 }">
            <a-button type="primary" v-if="permissions.indexOf('engineeTech:add') > -1" @click="doAdd"
              style="margin-left: 8px">新增</a-button>
            <!-- <a-button v-if="permissions.indexOf('engineeTech:edit') > -1" @click="doEdit" style="margin-left: 8px">
              修改</a-button>
            <a-button v-if="permissions.indexOf('engineeTech:detail') > -1" @click="doDetail" style="margin-left: 8px">
              查看</a-button> -->
            <a-button @click="handlePostExportXls('工程技术报表')" style="margin-left: 10px">导出</a-button>
            <a-button v-if="permissions.indexOf('engineeTech:delete') > -1" @click="doDel" style="margin-left: 8px">
              删除</a-button>
            <a-button @click="searchReset()" style="margin-left: 8px">刷新</a-button>
          </a-col>
          <a-col :xl="{ span: 10 }" :lg="{ span: 10 }" style="display:flex" justify="end">
            <a-input-group compact style="display:flex">
              <a-select v-model="queryParam.searchField" v-if="freshKey" @change="searchFieldChange">
                <a-select-option value="code"> 项目号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </a-select-option>
                <a-select-option value="name"> 技术名称 </a-select-option>
                <a-select-option value="publishUserName"> 项目经理 </a-select-option>
              </a-select>
              <a-input-search v-model="queryParam.keyword" @search="searchQuery" placeholder="请按照关键字进行搜索" />
            </a-input-group>
            <a-button class="hte-btn del-btn" @click="showSearchForm = true">高级搜索</a-button>
          </a-col>
        </a-row>
      </a-form>

      <a-modal :visible="showSearchForm" :maskClosable="false" width="60vw" :bodyStyle="{ padding: '10px' }"
        title="高级查询" @ok="handleToSearch" @cancel="showSearchForm = false">
        <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol">
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-model-item label="状态">
                <a-select style="width: 100%" v-model="queryParam.status">
                  <a-select-option v-for="d in dicts.statusDic" :value="d.code" :key="d.code">{{ d.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="技术编号">
                <a-input v-model="queryParam.code" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="技术名称">
                <a-input v-model="queryParam.name" />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-model-item label="技术类别">
                <a-select style="width: 100%" v-model="queryParam.techCategory">
                  <a-select-option v-for="d in categoryDic" :value="d.code" :key="d.code">{{ d.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="项目经理">
                <a-input v-model="queryParam.publishUserName" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-modal>
    </div>
    <div class="content-list">
      <a-table ref="table" bordered size="middle" :rowKey="rowKey" :columns="columns" :dataSource="dataSource"
        :pagination="ipagination" :rowSelection="{
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
          onSelectAll: onSelectAll,
          columnWidth: 1,
        }" :loading="loading" :scroll="{ x: true }" @change="handleTableChange">
        <template slot="visitsNum" slot-scope="visitsNum"> {{ visitsNum.first }} {{ visitsNum.last }} </template>
        <template slot="submitTimeRender" slot-scope="text">{{ formatDate(text || '', 'yyyy-MM-dd HH:mm:ss') }}
        </template>
        <template slot="createDateRender" slot-scope="text"> {{ formatDate(text || '', 'yyyy-MM-dd') }} </template>
         <template slot="fileCodeRender" slot-scope="text,record"> <span class="font-active" @click="doDetail(record)">
              {{ text || record.fileNoShow }}</span> </template>
      </a-table>
    </div>
    <template slot="footer">
      <a-button @click="handleConfirm">关闭</a-button>
    </template>
  </a-modal>
</template>


<script>
import Vue from 'vue'
import { getAction, postAction } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListSearchMixin'
import { ACCESS_TOKEN, USER_NAME } from '@/store/mutation-types'
import { formatDate } from '@/utils/util'
export default {
  name: 'SubTechList',
  mixins: [JeecgListMixin],
  components: {
    HomeNav: () => import('@/components/layouts/HomeNav'),
  },
  data() {
    return {
      disableMixinCreated:true,
      show: false,
      description: '科技信息列表',
      freshKey: true,
      permissions: [],
      myPermission: '/upms/user/getAllPermissionValues',
      /* 勾选导出参数 */
      rowKey: 'id',
      busType: 'TechEngineeList',
      userinfo: {
        info: this.$store.getters.userInfo,
        module: 'ContractReportInfo',
      },
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '50'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
      },
      columns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 5,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '状态',
          align: 'center',
          width: 60,
          dataIndex: 'statusShow',
        },
        {
          title: '技术编号',
          align: 'center',
          width: 100,
          dataIndex: 'fileCode',
          scopedSlots:{customRender:"fileCodeRender"}
        }, {
          title: '技术名称(脱密)',
          align: 'center',
          width: 150,
          dataIndex: 'name',
        },
        {
          title: '技术等级',
          align: 'center',
          width: 100,
          dataIndex: 'techLevel',
        },
        {
          title: '申请人',
          align: 'center',
          width: 100,
          dataIndex: 'createUserName',
        },
        {
          title: '申请日期',
          align: 'center',
          width: 100,
          dataIndex: 'createDate',
          scopedSlots: { customRender: 'createDateRender' },
        },
        {
          title: '提交时间',
          align: 'center',
          width: 100,
          dataIndex: 'submitTime',
          scopedSlots: { customRender: 'submitTimeRender' },
        },
      ],
      url: {
        list: '/rad/technology/list',
        exportXlsUrl: '/rad/technology/engineeExportXls',
        delete: '/rad/technology/delete',
      },
      dicts: {
        statusDic: [
          { code: 0, name: '创建中' },
          { code: 1, name: '审批中' },
          { code: 2, name: '已通过' },
          { code: 3, name: '不通过' }
        ]
      },
      categoryDic: [],
      showSearchForm: false,
      keyword: '',
      labelCol: { span: 8 },
      wrapperCol: { span: 15 },
      userId: Vue.ls.get(USER_NAME),
      queryParam: { searchField: 'code', techClass: '40' },
      projectNo:"",
    }
  },
  mounted() {

  },
  computed: {},
  methods: {
    formatDate,
    init(projectNo, projectClass) {
      this.dataSource = []
      this.projectNo = projectNo
      this.queryParam.code = projectNo
      this.queryParam.techClass = projectClass
      this.queryParam.searchField = 'code'
      getAction(this.myPermission, { projectId: -1 }).then((res) => {
        if (res.code == 200) {
          this.permissions = res.result
        } else {
          this.$message.warning('加载权限数据失败:' + res.message)
        }
      })
      this.initDict('技术库-技术类别（专业）', 'categoryDic')
      this.loadData();
      this.show = true
    },
    sorterFunc(a) {
      alert('sorterFunc:', a)
    },
    initDict(type, variable) {
      getAction('/manage/codeInfo/list', { type: type, isdel: 0 })
        .then((res) => {
          if (res.code == 200) {
            this[variable] = res.result.records
          } else {
            this.$message.warning('字典初始化[' + type + ']失败:' + res.message)
          }
        })
        .catch((res) => {
          this.$message.warning('字典初始化[' + type + ']异常:' + res.message)
        })
    },
    searchFieldChange() {
      this.freshKey = !this.freshKey
      this.freshKey = !this.freshKey
    },
    handleToSearch() {
      this.showSearchForm = false
      this.searchQuery()
    },
    searchReset() {
      this.queryParam = {}
      this.queryParam.code = this.projectNo
      this.queryParam.searchField = 'code'
      this.queryParam.techClass = '40'
      this.handleToSearch()
    },
    doAdd() {
      let urlJump = this.$router.resolve({ path: `/techEngineeEdit?projectNo=`+this.projectNo })
      window.open(urlJump.href, '_blank')
    },
    doEdit() {
      if (this.selectionRows == null || this.selectionRows.length != 1) {
        this.$message.warning('请选择1条数据')
        return
      }
      var record = this.selectionRows[0]
      if (record.createUserId != this.userId) {
        this.$message.warning('选中数据创建人为【' + record.createUserId + '】，您无权修改')
        return
      }
      if (record.status == 1 || record.status == 2) {
        this.$message.warning('审核中和审核通过的技术信息不可修改')
        return
      }
      let urlJump = this.$router.resolve({ path: `/techEngineeEdit?id=` + record.id })
      window.open(urlJump.href, '_blank')
    },
    doDel() {
      if (this.selectionRows == null || this.selectionRows.length != 1) {
        this.$message.warning('请选择1条数据')
        return
      }
      var record = this.selectionRows[0]
      if (record.createUserId != this.userId) {
        this.$message.warning('选中数据创建人为【' + record.createUserId + '】，您无权删除')
        return
      }
      if (record.status == 1 || record.status == 2) {
        this.$message.warning('审核中和审核通过的技术信息不可删除')
        return
      }
      getAction(this.url.delete, { id: record.id }).then((res) => {
        if (res.success) {
          this.$message.success('操作成功')
          this.searchReset()
        } else {
          this.$message.warning('操作失败:', res.message)
        }
      })
    },
    doDetail(record) {
      // if (this.selectedRowKeys == null || this.selectedRowKeys.length != 1) {
      //   this.$message.warning('请选择1条数据')
      //   return
      // }
      let urlJump = this.$router.resolve({ path: `/techEngineeEdit?id=` + record.id })
      window.open(urlJump.href, '_blank')
    },
    doAudit() {
      if (this.selectionRows == null || this.selectionRows.length != 1) {
        this.$message.warning('请选择1条数据')
        return
      }
      var record = this.selectionRows[0]
      if (record.status != 1) {
        this.$message.warning('当前项目状态非待审核')
        return
      }
      if (record.auditUser != this.userId) {
        this.$message.warning('选中数据审核人为【' + record.auditUser + '】，您无权审核')
        return
      }

      let urlJump = this.$router.resolve({ path: `/techEngineeEdit?detail=1&audit=1&id=` + record.id })
      window.open(urlJump.href, '_blank')
    },
    doHot() {
      let urlJump = this.$router.resolve({ path: `/techListHot?type=40` })
      window.open(urlJump.href, '_blank')
    },
    handleClose() {
      this.show = false
    },
    handleConfirm() {
      this.show = false
    }
  },
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
@import '~@assets/less/hte-main.less';
@import '~@assets/less/hte-main.less';

.page-main {
  .banner {
    background-image: url(../../assets/tech/techEngineeHead.png);
  }

  .container {
    background-color: white;

    .content-list {
      margin-top: 15px;
    }
  }
}
</style> 